<template>
	<view class="posiBottom">
		<uni-popup :round="15" scroll-y="true" :overlayStyle="{'touch-action':'none'}" class="popupWidth"
			ref="popup" type="center">
			<view>
				<view class="boxpopuBox">
					<view class="posiContent" >
						<view class="priceDateBox pricMar">
							<!-- <view class="titleBox lihItem">时间：{{dish.orderTime | formatTime}}</view> -->
							<view class="lihItem goodBoxsClss">
								<view>菜名：{{dish.foodName}}</view>
								<!-- <view class="rigthGoods">
									<view>x{{item.count}}</view>
								</view> -->
							</view>
							<view class="money">￥{{dish.showPrice}}元</view>
	
						</view>
						<view class="imgBoxs">
							<image class="imgW" :src="dish.image"></image>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		name:"dishDetails",
		props:{
			dish:{
				type:Object,
				default:{}
			}
		},
		data() {
			return {
				
			};
		},
		methods:{
			async showPop(){
				this.$refs.popup.open("center");
			}
		}
	}
</script>

<style lang="scss">
	
	.popupWidth {
		width: 70vw;
	}
	
	.boxpopuBox {
		font-size: 28rpx;
		max-height:750rpx; // 固定高度
		overflow-y: scroll; // 超出滚动
		overscroll-behavior: none; // 禁止滚动溢出
		border-radius: 20rpx;
		background: #fff;
		.pricMar {
			// margin-bottom: 15rpx;
			&>view{
				margin-bottom:10rpx;
			}
		}
		.rigthGoods {
			// display: flex;
		}
		.lihItem {
			// line-height: 70rpx;
			// height: 70rpx;
			@include flexs(space-between, center);
		}
		.goodBoxsClss {
			display: flex;
		}
		
		.posiContent {
			padding: 30rpx;
			
			width:600rpx;
			// width: 80vw;
			
			.popWidth {
				// width: 90vw;
				height: 20vh;
				font-weight: 800;
				font-size: 35rpx;
			}
			.money{
				color:#FD0000;
			}
		
			.imgBoxs {
				display: flex;
				justify-content: center;
		
				.imgW {
					width: 600rpx;
					height:600rpx;
				}
			}
		}
		
	}
</style>